<template>
  <div>
    <el-form
      ref="form"
      label-width="120px"
      style="margin: 10px; margin-right: 50px"
    >
      <el-form-item label="积分区间开始">
        <el-input
          v-model="integralGrade.integralStart"
          type="number"
        ></el-input>
      </el-form-item>
      <el-form-item label="积分区间结束">
        <el-input v-model="integralGrade.integralEnd" type="number"></el-input>
      </el-form-item>
      <el-form-item label="借款额度">
        <el-input v-model="integralGrade.borrowAmount" type="number"></el-input>
      </el-form-item>
      <el-form-item>
        <el-button type="primary" @click="handleCommit">提交</el-button>
        <el-button>取消</el-button>
      </el-form-item>
    </el-form>
  </div>
</template>
<script>
import integralGradeApi from "@/api/integralGrade";
export default {
  data() {
    return {
      integralGrade: {},
    };
  },
  created() {
    //页面渲染前 获取访问当前页面的请求参数
    // 在vue的页面中可以获取到访问当前页面的 路由对象 $route
    // console.log(this.$route);
    // console.log(this.$route.query.id);
    // console.log(this.$route.params.id);
    //根据传过来的id查询积分等级回显: 注意id精度丢失问题
    if (this.$route.params.id) {
      integralGradeApi.getById(this.$route.params.id).then((r) => {
        // console.log(r.data.item);
        this.integralGrade = r.data.item;
      });
    }
  },
  methods: {
    handleCommit() {
      //判断提交请求是新增还是更新
      if (this.$route.params.id) {
        //更新
        this.handleEdit();
      } else {
        //新增
        this.handleSave();
      }
    },
    handleEdit() {
      integralGradeApi.updateById(this.integralGrade).then((r) => {
        this.$message.success("更新成功");
        //跳转到列表页展示
        //this.$router可以获取到在router/index.js中 注册给vue的router对象，通过地址 让路由对象匹配跳转页面
        this.$router.push("/integral-grade/table");
      });
    },
    handleSave() {
      // console.log(this.integralGrade);
      integralGradeApi.save(this.integralGrade).then((r) => {
        this.$message.success("新增成功");
        //跳转到列表页展示
        //this.$router可以获取到在router/index.js中 注册给vue的router对象，通过地址 让路由对象匹配跳转页面
        this.$router.push("/integral-grade/table");
      });
    },
  },
};
</script>
